<template>
	<view>
		<view class="mine-header" :style="'height:' + setting.header.height + 'px;' + 'padding-top:' + setting.header.top + 'px;padding-bottom:12upx'">
			<view class="inner">
				<image src="http://static.kuaimayoupin.com/0119432821369318.png" mode="aspectFill" class="mine-return-img" @click="toMine" v-if="!setting.isHomePage"></image>
			</view>
		</view>
		<view class="mine-card">
			<view class="inner">
				<view class="mine-card-left">
					<view class="mine-head-box" v-if="userInfo.avatar"><image :src="userInfo.avatar" @click="previewImageFun" mode="aspectFit" class="mine-head"></image></view>
					<view class="mine-head-box" v-else><image src="http://static.kuaimayoupin.com/5814340611455953.png" @click="previewImageFun" mode="aspectFit" class="mine-head"></image></view>
					<template v-if="userInfo.mobile">
						<view class="go-to-homepage" @click="toHomePage">进入主页</view>
					</template>
				</view>
				<view class="mine-card-right" v-if="userInfo._id">
					<view class="mine-info">
						<view class="mine-name">{{ userInfo.nick_name || userInfo.mobile }}</view>
						<text class="mine-tag orange-tag" v-if="userInfo.vip">{{ userInfo.vip == -1 ? '非会员' : userInfo.vip }}</text>
						<text class="mine-tag blue-tag">{{ userInfo.certificate_status == 0 ? '待认证' : userInfo.certificate_status == 1 ? '已认证' :  userInfo.certificate_status == -1 ? '未认证' : '认证失败'}}</text>
						<navigator url="/pageA/my-profile/my-profile">
							<image src="http://static.kuaimayoupin.com/3843081084037387.png" mode="aspectFit" class="mine-edit"></image>
						</navigator>
					</view>
					<view class="mine-address">
						ID:{{userInfo.codeID}}
					</view>
					<view class="mine-address">{{ userInfo.work_place == '保密' ? '暂未填写' : '现居' + userInfo.work_place || userInfo.native_place }}{{ userInfo.job!='保密' ? '/' + userInfo.job : '暂未填写' }}</view>
					
					
					
					<view class="mine-signature">{{ userInfo.soliloquy ? userInfo.soliloquy : '' }}</view>
					<view class="tag-box">
						<text class="mine-tag orange-tag" v-if="userInfo.age">{{ userInfo.age+ '岁' }}</text>
						<text class="mine-tag pink-tag" v-if="userInfo.constellation">{{ userInfo.constellation }}</text>
					</view>
				</view>
				<view class="mine-card-right" v-else>
					<!-- #ifdef MP-WEIXIN -->
					<button class='login-opt-btn' @click="showAuth">
					    <view>点击登录/注册</view>
					 </button>
					<!-- #endif -->
					<!-- #ifdef APP-VUE -->
					<view  @click="showAuth" class="login-opt-btn">点击登录/注册</view>
					<!-- #endif -->
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	props: {
		setting: {
			type: Object
		},
		userInfo: {
			type: Object
		}
	},
	data() {
		return {
			idCode : ''
		};
	},
	created() {
		this.getWxCode();
		console.log(this.userInfo)
	},
	methods: {
		showAuth(){
			console.log('showAuth');
			this.$emit('pop');
		},
		toHomePage() {
			uni.navigateTo({
				url: '/pageA/homepage/homepage'
			});
		},
		previewImageFun(e){
			let current = this.userInfo.avatar || 'http://static.kuaimayoupin.com/5814340611455953.png'
			wx.previewImage({
			  current, // 当前显示图片的http链接
			  urls: [current] // 需要预览的图片http链接列表
			})
		},
		toMine() {
			this.$emit('toMine');
		},
		//获取微信code
		getWxCode() {
			let that = this;
			uni.login({
				provider: 'weixin',
				success: function(loginRes) {
					console.log('loginRes');
					that.wxLogin(loginRes.code);
				},
				fail: err => {
					console.log('err', err);
				}
			});
		},
		//将code传给后台
		wxLogin(code) {
			let that = this;
			this.$request
				.post({
					url: 'user/setWXCode',
					data: {
						code: code
					}
				})
				.then(response => {
					const data = response.data;
					this.sessionKey = data.session_key;
					this.openid = data.openid;
					const USER = {
						sessionKey: data.session_key,
						openid: data.openid
					};
				});
		},
		//获取用户手机号
		decryptPhoneNumber(e) {
			//点击获取手机号码按钮
			this.encrypdata = e.detail.encryptedData;
			this.ivdata = e.detail.iv;
			console.log('我的页面授权',this.encrypdata,this.ivdata)
			if(this.encrypdata && this.ivdata){
				this.$request
					.post({
						url: 'user/wxlogin',
						data: {
							encryptedData: this.encrypdata,
							iv: this.ivdata,
							sessionKey: this.sessionKey,
							openid: this.openid
						}
					})
					.then(res => {
						const data = res.data;
						uni.setStorageSync('userInfo', data);
						try {
							uni.setStorageSync('token', data.token);
							this.$emit('uploadUser');
						} catch (e) {
							// error
						}
					});
			}/* else{
				uni.showToast({
					icon: 'none',
					title: '请登录'
				});
			} */
		}
	}
};
</script>

<style lang="scss">
.mine-header {
	position: fixed;
	top: 0;

	.mine-return-img {
		display: block;
		width: 24px;
		height: 24px;
	}
}
.mine-card {
	padding-bottom: 80upx;
	.inner {
		display: flex;
		justify-content: flex-start;
		
		image{
			object-fit: cover;
		}
	}
}
.login-opt-btn:after{
	border: none;
}
.tag-box{
	.mine-tag{
		border: none;
		background: #D6D5D3;
		}
}
</style>
